<a id="scroll-up" class="scroll-up" href="#">
	<svg viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
		<path d="M0 0h24v24H0z" fill="none"></path>
		<path fill="rgba(255,255,255,1)" d="M11.9997 10.8284L7.04996 15.7782L5.63574 14.364L11.9997 8L18.3637 14.364L16.9495 15.7782L11.9997 10.8284Z">
		</path>
	</svg>
</a>
<style>
/* From Uiverse.io by ArturCodeCraft - Tags: button, scroll to top, scroll */
/* <reset-style> ============================ */
a {
  text-decoration: none;
}
/* <main-style> ============================ */
.scroll-up {
	/* position: fixed; */
  right: 3rem;
  bottom: -50%;
  z-index: 10;
  width: 32px;
  height: 32px;
  border-radius: 4px;
  background-color: rgba(29, 29, 31, 0.7);
  backdrop-filter: saturate(180%) blur(20px);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  transition: bottom .4s, transform .4s;
}

.scroll-up:hover {
  transform: translateY(-.25rem);
}

/* Show scroll-up */
._show-scroll {
  bottom: 3rem;
}

@media (max-width: 1199.98px) {
  .scroll-up {
    right: 1rem;
  }
}
</style>
